import React, { useMemo } from "react";

interface IColorProps {
  color: string;
}

const Color: React.FC<IColorProps> = ({ color }) => {
  const SIDE = 100;
  const style = useMemo(() => {
    const s: React.CSSProperties = {
      margin: 20,
      backgroundColor: color,
      width: SIDE,
      height: SIDE,
      border: "1px dashed blue",
    };
    return s;
  }, [color]);
  return <div style={style}></div>;
};

export default Color;
